<template>
    <article class="frosted-glass">
        <main ref="mainRef">个人中心</main>
      <button @click="readDirectory">读取目录</button>
      <ul>
        <li v-for="(item, index) in directoryList" :key="index">
          {{ item.name }} ({{ item.isDirectory ? '目录' : '文件' }})
        </li>
      </ul>
    </article>

</template>

<script setup lang="ts">
import { ref } from 'vue'
// 引入 Tauri API
import { readDir,stat, BaseDirectory } from '@tauri-apps/plugin-fs';
const mainRef = ref();

const directoryList = ref([]);

async function readDirectory() {
  try {
    // 读取桌面目录中的内容
    const defaultPath : string = "D:/";
    const files : any = await readDir(defaultPath, { baseDir: BaseDirectory.AppLocalData });
    for (const file of files) {
      // 使用 stat 获取文件的详细信息
      try {
        const fileStats : any = await stat(defaultPath + file.name);
        file.size = fileStats.size;
        file.atime = new Date(fileStats.atime).toLocaleString();
        file.mtime = new Date(fileStats.mtime).toLocaleString();
      } catch (err) {
        console.error(`无法访问文件 ${file.name}: ${err.message}`);
      }
    }
    directoryList.value = files;  // 存储目录内容
  } catch (error) {
    console.error('读取目录失败:', error);
  }
}

</script>

<style scoped>
.read-the-docs {
  color: #888;
}

</style>
